html,body{
  width: 100%;
  height: 100%;
  background-color: #f6f6f6;
}
*{
  margin: 0;
  padding: 0;
}

div,h1,h2,h3,p,span,ul,li,a,button,input,img{
  box-sizing: border-box;
}
ul,ol{
  list-style: none;
}
a{
  text-decoration: none;
  color: inherit;
}
i,em{
  font-style: normal;
}

/* 购物车盒子 */
.cart-head{
  width: 100%;
  height: 102px;
  border-bottom: 2px solid #e45;
  background: #fff;

  // 购物车版心
  .head-wrap{
    width: 1200px;
    height: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;

    .logo-area{
      width: 590px;
      display: flex;
      justify-content: space-between;

      .logo-pic{
    
        width: 48px;
        height: 48px;
        margin: 25px 45px 0 0;
        img{
          width: 100%;
          height: 100%;
        }
      }
    }
    .cart-info{
      width: 494px;
      display: flex;
      justify-content: space-between;
      
      h2{
        
        width: 140px;
        font-size: 28px;
        font-weight: normal;
        line-height: 100px ;
        color: #424242;
      }

      p{
        font-size: 12px;
        line-height: 115px ;
        color: #757575;
      }
    }
    .user-msg{
      width: 198px;
      height: 48px;
      line-height: 48px;
      align-self: center;
      position: relative;
      font-size: 12px;
      color: #757575;

      span{
        display: inline-block;
        line-height: 48px;
        height: 12px;
        width: 2px;
        margin:0 5px;
        background-color: #ccc;
      }
      .user-msg-menu{
        position: absolute;
        top: 34px;
        width: 65px;
        text-align: center;
        letter-spacing: 2px;
        display: none;
        li{
          line-height: 18px;
        }
      }
    }
  }  
}

.cart-container{
  width: 100%;
  height: 100%;
  margin-top: 35px;

  .cart-wrap{
    width: 1200px;
    margin: 0 auto;
    .cart-content{
      width: 100%;
      
      .top{
        width: 100%;
        background: #fff;

        .cart-table{
          width: 100%;
          border-collapse: collapse;
          
          tr{
            width: 100%;
            border-bottom: 1px solid #ccc;
            color: #424242;
            td{
              
              text-align: center;
              padding: 8px 0;
            }
            .shop-name{
           
              overflow: hidden;
              white-space: nowrap; // 元素内的空白默认忽略
              text-overflow: ellipsis; // 超出文本显示为省略号
            }
            .num{
              
              p{
                width: 150px;
                height: 40px;
                display: flex;
                align-items: center;
                margin: 0 auto;
                border: 1px solid #cccccc;
                padding: 0 15px;
                input{
                  border: none;
                  outline: none;
                  width: 100%;
                  text-align: center;
                }
                span{
                  cursor: pointer;
                }
              }
            }
            .sub-price{
              color: #ff6700;
            }
            .delete{
              cursor: pointer;
              color: #ccc;
              font-size: 14px;
            }
          }
          .head-tr{
            height: 70px;
            
            .th1{
              position: relative;
              i{
                position: absolute;
                display: block;
                left: 45px;
                top: 22px;
                width: 40px;
              }
            }
          }
        }
      }

      .bottom{
        margin-top: 25px;
        width: 100%;
        height: 50px;
        padding-left: 40px;
        display: flex;
        background: #fff;
        justify-content: space-between;

        .product-num{
          line-height: 50px;
          font-size: 14px;
          a{
            cursor: pointer;
            margin-right: 8px;
          }
          span{
            display: inline-block;
            height: 17px;
            width: 1px;
            background: #ccc;
            vertical-align: text-bottom;
          }

          p{
            margin-left: 8px;
            display: inline-block;
            em{
              color: #ff6700;
            }
          }
        }
      }
      .total-price{
        height: 100%;
        line-height: 50px;

        p{
          display: inline-block;
          margin-right: 45px;
          font-size: 14px;
          color: #ff6700;
          i{
            font-size: 20px;
          }
        }
        button{
          width: 204px;
          height: 100%;
          line-height: 55px;
          text-align: center;
          border: none;
          outline: none;
          color: #fff;
          background: #ff6700;
          font-size: 16px;
          font-weight: 600;
          cursor: pointer;
        }
      }
    }
  }
  
}